<template>
<view class="pk-header flex-sb">
	<view class="pk-header-left flex-c">
		<view class="back-icon" v-if="back" @click="goBack"><i class="ri-arrow-left-line"></i></view>	
		<text class="left-title">{{title}}</text>	
	</view>
	<view class="pk-header-right">
		<slot></slot>	
	</view>	
</view>
</template>

<script>
export default{
	name:'pk-header',
	props:{
		title:{
			type:String,
			default:"标题"
		},
		back:{
			type:Boolean,
			default:false,
		}
	},
	data(){
		return {
			
		}
	},
	methods:{
		goBack(){
			uni.navigateBack({
				delta:1
			})
		}
	}
}
</script>

<style lang="scss" scoped>
.pk-header{
	height: 50px;
	border-bottom:1px solid #f4f4f4;
	// margin-bottom: 12px;

	.left-title{
		font-size: 18px;
	}
	.back-icon{
		width: 30px;
		height: 30px;
		background: #f4f4f4;
		border-radius: 50%;
		text-align: center;
		font-size: 20px;
		line-height: 30px;
		cursor: pointer;
		color: #4c4c4c;
		margin-right: 12px;
	}
}	
</style>